<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>灯泡开关</title>
</head>
<body>
<img src="img/off.gif" id="light"/>
</body>
</html>


<script>
    //定义成员变量 isOpen 设置为关闭的状态
    isOpen = false;
    //给图片标签 设置一个 点击事件 点击之后 可以进行图片切换
    document.querySelector("#light").onclick = function () {
        //设置src的值,如果是true 切换为关灯 如果是false 切换为开灯
        this.src = isOpen ? "img/off.gif" : "img/on.gif";

        //切换标记 isOpen 的状态,取反操作
        isOpen = !isOpen;
    }
</script>